import { createApp } from 'vue'
import App from './App.vue'
import router from './router'
import ElementPlus from 'element-plus'
import 'element-plus/dist/index.css'
import './assets/css/style.scss' 
import * as ElementPlusIconsVue from '@element-plus/icons-vue'
import axios from 'axios'
import request from './utils/request'
import * as apiServices from './utils/api'

// Create storage utility
const storage = {
  set(key, value) {
    localStorage.setItem(key, JSON.stringify(value))
  },
  get(key) {
    return JSON.parse(localStorage.getItem(key) || 'null')
  },
  remove(key) {
    localStorage.removeItem(key)
  },
  clear() {
    localStorage.clear()
  }
}

const app = createApp(App)

// Global properties
app.config.globalProperties.$storage = storage
app.config.globalProperties.$http = request
app.config.globalProperties.$axios = axios // 保留原始axios以防需要
app.config.globalProperties.$api = apiServices // 添加API服务

// 设置axios默认请求头
axios.defaults.headers['Content-Type'] = 'application/json'

// Register all icons
for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
  app.component(key, component)
}

app.use(router)
app.use(ElementPlus)
app.mount('#app')
